<template>
  <div class="rejectCheck">
  <el-table
      :data="blogData"
      style="width: 100%">
    <el-table-column
        prop="id"
        label="文章编号"
        width="180">
    </el-table-column>
    <el-table-column
        prop="title"
        label="文章标题"
        width="180">
    </el-table-column>
    <el-table-column
        align="center"
        prop="nickName"
        label="作者">
    </el-table-column>
    <el-table-column
        align="center"
        prop="contentImgUrl"
        label="文章封面">
      <template slot-scope="scope">
        <img :src="scope.row.contentImgUrl" width="50%">
      </template>
    </el-table-column>
    <el-table-column
        align="center"
        prop="content"
        label="文章正文">
      <template slot-scope="scope">
        <el-button @click="showDetail(scope.row)" type="primary" style="margin-left: 16px;">
          查看
        </el-button>
      </template>
    </el-table-column>
    <el-table-column label="创建时间"  width="200px" align="center" prop="createTime">
    </el-table-column>
  </el-table>
  <el-pagination
      @current-change="changePage"
      layout="total, prev, pager, next"
      :hide-on-single-page="true"
      :page-size="pageSize"
      :current-page="currentPage"
      :total="total">
  </el-pagination>
    <el-dialog
        title="正文"
        :visible.sync="dialogVisible"
        width="30%"
        :before-close="handleClose">
      <span v-html="this.detail"></span>
      <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
  </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "BlogSon",
  data(){
    return{
      detail:'',
      dialogVisible:false,
      // 分页相关数据
      currentPage: this.$router.currentRoute.query.page ? parseInt(this.$router.currentRoute.query.page) : 1,
      pageSize: '',
      total:'',
      content:'',
      contentFormVisible:false,
      editRules:[],
      blogData:[],
      newForm:{},
      editForm:{},
    }
  },
  methods:{
    handleClose(done) {
      this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {});
    },
    showDetail(row){
      this.detail =  row.content
      this.dialogVisible = true;
    },
    changePage(page) {
      this.$router.replace('?page=' + page);
      this.openBackList();
    },
    //获取已退回文章列表
    openBackList(){
      this.axios
          .create({
            'headers':{
              'Authorization': localStorage.getItem('localJwt')
            }
          })
          .get("http://localhost:8080/v1/contents/rejectCheckList").then((response)=> {
        console.log("请求已发送")
        console.log((response.data.code))
        if (response.data.code === 1){
          this.blogData = response.data.data;
          console.log(this.blogData)
        }
      })
    },
  },
  mounted(){
      this.openBackList();
  }
}
</script>

<style scoped>

</style>